<!--
	@create by
	@update by
	@description
-->
<div>
    <!--主页面列表 start-->
    <el-form-q :field-data="queryFields" :buttons="queryButtons" ref="queryForm"></el-form-q>
    <div class="yu-toolBar">
        <el-button-group>
            <el-button icon="edit" @click="divisionFn" v-loading.fullscreen.lock="fullscreenLoading" element-loading-text="分案处理中..."
                       v-if="checkPermission('divCase')">分案</el-button>
            <el-button icon="document" @click="assignFn" v-if="checkPermission('detail')">分配查看</el-button>
        </el-button-group>
    </div>
    <el-table-x ref="reftable" :row-index="true" :base-params="baseParams"
                :data-url="dataUrl" :table-columns="tableColumns" :request-type="'POST'"></el-table-x>
    <!--主页面列表 end-->

    <!--说明dialog可配置宽高属性，若不配置则宽度默认为屏幕50%，高度自适应-->
    <!--width="650px" height="380px" -->

    <!--分案机构版本号展示-->
    <el-dialog-x title="分案机构" :visible.sync="distriRateVisible" size="large">
        <el-form-q :field-data="queryOrgVerFields" :buttons="queryOrgVerButtons"></el-form-q>
        <el-row :gutter="10">
            <el-col :span="12">
                <div class="yu-toolBar">
                    <h2>版本号</h2>
                </div>
                <el-table-x ref="refRatetable" :row-index="true" :radiobox="true" :base-params="ratebaseParams" @row-click="searchdataRateDelFn"
                            :data-url="dataRateUrl" :table-columns="tableRateColumns" :request-type="'POST'"></el-table-x>
            </el-col>
            <el-col :span="12">
                <div class="yu-toolBar">
                    <h2>详情列表</h2>
                </div>
                <el-table-x ref="refRateDettable" :data-url="dataRateDelUrl" :default-load="false" :table-columns="tableDetColumns"
                            :request-type="'POST'" :base-params="ratebaseDetParams"></el-table-x>
            </el-col>
        </el-row>
        <div class="yu-grpButton">
            <el-button type="primary" @click="confirmVerNoFn" icon="check">确定</el-button>
            <el-button type="primary" @click="cancelVerNoFn" icon="yx-undo2">取消</el-button>
        </div>
    </el-dialog-x>
    <!--分配查看主页面 start-->
    <el-dialog-x :title="viewTitle[viewType]" :visible.sync="dialogDistriVisible" size="full">
        <el-form-q :field-data="queryDistriFields" :buttons="queryDistriButtons"></el-form-q>
        <div class="yu-toolBar">
            <el-button-group>
                <el-button icon="check" @click="closeCaseFn" v-if="checkPermission('settle')">结案</el-button>
                <el-button icon="view" @click="detailFn" v-if="checkPermission('detailFP')">查看</el-button>
                <el-button icon="message" @click="manualFn" v-if="checkPermission('taskflow')">人工流转</el-button>
                <el-button icon="plus" @click="importFn" v-if="checkPermission('import')">导入催收结果</el-button>
                <el-button icon="upload2" @click="exportFn" v-if="checkPermission('export')">导出</el-button>
                <el-button icon="yx-undo2" @click="withdrawFn" v-if="checkPermission('withdraw')">撤回</el-button>
            </el-button-group>
        </div>
        <el-table-x ref="reftableDistri" :row-index="true" :base-params="distriParams"
                    :data-url="dataUrlDistri" :table-columns="distriColumns" :request-type="'POST'"></el-table-x>
        <el-form-x :buttons="closeButtons"></el-form-x>
    </el-dialog-x>
    <!--分配查看主页面 end-->

    <!--分配查看子页面 end-->
    <el-dialog-x :title="viewTitle[viewType]" :visible.sync="dialogSonVisible" size="full">
        <el-tabs type="border-card" v-model="tabName">
                <!--common start-->
                <el-card style="width: 100%;" shadow="always" header="客户基本信息" v-show="checkIsShowCus"
                         :body-style="{ padding: '10px' }">
                    <el-form-x ref="cusBaseInfo" :group-fields="cusBaseInfoFields" :disabled="formDisabled"
                               label-width="130px" style="padding: 12px 12px 0px 12px">
                    </el-form-x>
                </el-card>
                <div style="height: 24px"></div>
                <el-card style="width: 100%;" shadow="always" header="催收借据列表" v-show="checkIsShowCollReceipt"
                         :body-style="{ padding: '10px' }">
                    <el-form-x ref="collReceiptInfo" :group-fields="collReceiptInfoFields" :disabled="formDisabled"
                               :buttons="collReceiptButtons" label-width="130px" style="padding: 12px 12px 24px 12px">
                    </el-form-x>
                </el-card>
                <div style="height: 24px"></div>
                <el-card style="width: 100%;" shadow="always" header="历史催收记录" v-show="checkIsShowHisColl"
                         :body-style="{ padding: '10px' }">
                    <el-table-x ref="hisCollTable" :row-index="true" :base-params="hisCollParams"
                                :data-url="dataUrlhisColl" :table-columns="hisCollColumns"
                                :request-type="'POST'" style="padding: 12px 12px 0px 12px"></el-table-x>
                </el-card>
                <el-card style="width: 100%;" shadow="always" header="历史催收登记记录" v-show="isShowHisCollDetail"
                         :body-style="{ padding: '0px' }">
                    <el-table-x ref="hisCollDetailTable" :row-index="true" :base-params="hisCollDetailParams" :data-url="dataUrlhisColl"
                                :table-columns="hisCollDetailColumns" :request-type="'POST'" style="padding: 12px 12px 0px 12px"></el-table-x>
                </el-card>
                <div style="height: 24px"></div>
                <!--common end-->
                <!--人工流转 start-->
                <el-card style="width: 100%;" shadow="always" header="流转信息" v-show="checkIsShowFlow"
                         :body-style="{ padding: '10px' }">
                    <el-table-x ref="flowTable" :row-index="true" :base-params="flowParams"
                                :data-url="dataUrlflow" :table-columns="flowColumns"
                                :request-type="'POST'" style="padding: 12px 12px 0px 12px"
                                v-show="checkIsShowFlowTable"></el-table-x>

                    <el-form-x ref="flowInfo" :group-fields="flowInfoFields" :buttons="flowInfoButtons"
                               label-width="130px" style="padding: 12px 12px 24px 12px" v-show="checkIsShowFlowForm">
                    </el-form-x>
                </el-card>
                <!--人工流转 end-->
                <!--结案 start-->
                <el-card style="width: 100%;" shadow="always" header="诉讼催收登记信息" v-show="checkIsShowLitiColl"
                         :body-style="{ padding: '10px' }">
                    <el-form-x ref="litiCollInfo" :group-fields="litiCollInfoFields" :disabled="formDisabled"
                               :buttons="litiCollInfoButtons"
                               label-width="130px" style="padding: 12px 12px 0px 12px">
                    </el-form-x>
                    <div style="height: 24px"></div>
                </el-card>
                <div style="height: 24px"></div>
                <el-card style="width: 100%;" shadow="always" header="附件上传" v-show="checkIsShowAnnex"
                         :body-style="{ padding: '10px' }">
                    <div style="height: 12px"></div>
                    <div class="yu-toolBar">
                        <el-button-group>
                            <el-button icon="plus" @click="uploadAnnexFn">上传</el-button>
                            <el-button icon="document" @click="infoAnnexFn">查看</el-button>
                        </el-button-group>
                    </div>
                    <el-table-x ref="reftableAnnex"  :base-params="baseParamsAnnex"
                                :data-url="dataUrlAnnex" :table-columns="tableColumnsAnnex" :request-type="'POST'" >
                    </el-table-x>
                </el-card>
                <!--结案 end-->
        </el-tabs>
        <el-form-x :buttons="closeSonButtons"></el-form-x>
    </el-dialog-x>

    <el-dialog-x :title="viewTitle[viewType]" :visible.sync="dialogImportVisible" size="full">
        <!--<el-row type="flex" :gutter="20">
            <el-col :span="5">
                <div class="grid-content bg-purple">
                    <el-card class="box-card">
                        <div slot="header" class="clearfix">
                            <span style="line-height: 8px;">导入规则</span>
                        </div>
                        <div>
                        <span>
                          <font color="#ff0000">
                            <p>要啥自己填</p>
                            <p>要啥自己填</p>
                            <p>要啥自己填</p>
                            <p>要啥自己填</p>
                            <p>要啥自己填</p>
                          </font>
                        </span>
                        </div>
                    </el-card>
                </div>
            </el-col>
            <el-col :span="16">
                <div class="grid-content bg-purple">

                </div>
            </el-col>
        </el-row>-->

        <div class="yu-toolBar">
            <el-button-group>
                <el-button icon="edit" @click="singleCreateFn">单笔新增</el-button>
                <el-button icon="yx-file-excel" @click="downloadFn">模板下载</el-button>
                <el-button icon="upload" @click="importExcelFn">按模板导入</el-button>
                <!--<el-button icon="yx-bin" @click="singleDeleteFn">删除</el-button>-->
            </el-button-group>
        </div>

        <el-table-x ref="collRsTable" :row-index="true" :checkbox="false" :base-params="collRsParams" :default-load="false"
                    :data-url="dataUrlcollRs" :table-columns="collRsColumns"
                    :request-type="'POST'"></el-table-x>
        <el-form-x :buttons="closeImportButtons"></el-form-x>
    </el-dialog-x>

    <el-dialog-x title="按模板导入" :visible.sync="dialogImportExcelVisible" size="600px"  v-loading="loading2" element-loading-text="上传中...">
        <div style="text-align: center;">
            <el-input style="width: 80%;padding-top: 20px" placeholder="上传文件名..." :value="fileExcelName" :disabled="true"></el-input>
        </div>

        <div class="yu-toolBar" style="text-align: center;margin-top: 20px;">
            <el-button-group>
                <file-upload
                        ref="upload"
                        class="el-button"
                        :post-action="uploadUrl"
                        :extensions="extensions"
                        :data="fileData"
                        :headers="headers"
                        v-model="files"
                        accept="application/vnd.ms-excel,application/x-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
                        @input-filter="inputFilter"
                        @input-file="inputFile"
                        style="border-radius: 4px;background-color: #20a0ff;"
                        type="primary">
                    <i class="fa fa-plus"></i>
                    <span style="color: #FFFFFF">选择文件</span>
                </file-upload>
                <el-button-group style="padding-left: 5px">
                    <el-button style="border-radius: 4px;" type="primary" icon="upload" @click="commitFileFn">保存</el-button>
                </el-button-group>
                <el-button-group style="padding-left: 5px">
                    <el-button style="border-radius: 4px;" type="primary" icon="yx-undo2" @click="cancelFn">取消</el-button>
                </el-button-group>
            </el-button-group>
        </div>
    </el-dialog-x>
    <!-- 借据详情-->
    <el-dialog-x :title="viewTitle[viewType]" :visible.sync="dialogAccLaonVisible" size="full">
        <el-form-x ref="accLaonInfo" :group-fields="accLaonFields" :disabled="true" label-width="130px"
                   :buttons="accLaonButtons"></el-form-x>
    </el-dialog-x>
    <!--分配查看子页面 end-->

    <!-- 导入结果展示和确认 -->
    <el-dialog-x title="导入结果展示和确认" :visible.sync="dialogTempVisible" size="full" :before-close="concancelFn">
        <el-button icon="yx-bin" @click="tempDeleteFn">删除</el-button>
        <div style="height: 10px"></div>
        <el-table-x ref="collRsTempTable" :row-index="true" :checkbox="true" :base-params="collRsTempParams"
                    :data-url="dataUrlcollRsTemp" :table-columns="collRsTempColumns"
                    :request-type="'POST'"></el-table-x>
        <div class="yu-grpButton">
            <el-button type="primary" @click="confirmDataFn" icon="check">保存</el-button>
            <el-button type="primary" @click="concancelFn" icon="yx-undo2">取消</el-button>
        </div>
    </el-dialog-x>

    <el-dialog-x title="错误信息" :visible.sync="tipsVisible" width="50%" height="80%">
        <div class="el-table el-table--fit el-table--striped el-table--border el-table--enable-row-hover el-table--enable-row-transition"
             style="overflow-y: scroll;max-height: 500px">
            <div class="el-table__header-wrapper">
                <table class="el-table el-table__header">
                    <thead>
                    <tr>
                        <th style="width: 100px">序号</th>
                        <th>错误信息</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(error, index) in errors" :key="error.id">
                        <td>{{index + 1}}</td>
                        <td>
                            <div class="errorname">
                                {{errors[index]}}
                            </div>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="yu-toolBar" style="text-align: center;margin-top: 20px;">
            <el-button-group>
                <el-button class="cancelfn-btn" style="padding-left: 10px" icon="yx-undo2" @click="cancelFn1">关闭</el-button>
            </el-button-group>
        </div>
    </el-dialog-x>

    <!--单笔新增 start-->
    <el-dialog-x title="单笔新增" :visible.sync="dialogSingleVisible">
        <el-form-x ref="singleInfo" :group-fields="singleFields" :buttons="singleButtons"
                   label-width="130px">
        </el-form-x>
    </el-dialog-x>
    <!--单笔新增 end-->

    <el-dialog-x title="附件" :visible.sync="dialogVisibleAnnex" size="large">
        <el-form-x ref="annexForm" :group-fields="annexInfoFields" :disabled="annexFormDisabled"
                   label-width="130px" style="padding: 12px 12px 24px 12px">
        </el-form-x>
        <div class="yu-grpButton">
            <el-button type="primary" @click="saveAnnexFn" icon="check" v-if="flag != 'VIEWINFO'">保存</el-button>
            <el-button type="primary" @click="cancleAnnesFn" icon="yx-undo2" v-if="flag != 'VIEWINFO'">取消</el-button>
            <el-button type="primary" @click="cancleAnnesFn" icon="check" v-if="flag == 'VIEWINFO'">返回</el-button>
        </div>
    </el-dialog-x>
</div>
